<!DOCTYPE html>

<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <title>Shadow Editor Viewer</title>
    <link rel="shortcut icon" href="favicon.ico">
    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <link href="build/ShadowEditor.css" rel="stylesheet" />
    <style>
        .player {
            position: absolute;
            left: 0;
            top: 0;
            right: auto;
            bottom: auto;
            width: 100%;
            height: 100%;
            background-color: white;
        }
    </style>
</head>

<body>
    <div id="container" tabindex="10"></div>

    <!-- three.js -->
    <script src="assets/js/three.js"></script>

    <!-- libs -->
    <script src="assets/js/libs/react.js"></script>
    <script src="assets/js/libs/react-dom.js"></script>
    <script src="assets/js/libs/stats.min.js"></script>
    <script src="assets/js/libs/jszip.min.js"></script>
    <script src="assets/js/libs/inflate.min.js"></script>
    <script src="assets/js/libs/gunzip.min.js"></script>
    <script src="assets/js/d3/d3.js"></script>

    <script src="assets/js/math/SimplexNoise.js"></script>
    <script src="assets/js/math/ImprovedNoise.js"></script>
    <script src="assets/js/misc/GPUComputationRenderer.js"></script>
    <script src="assets/js/shaders/TerrainShader.js"></script>
    <script src="assets/js/libs/ammo.js"></script>

    <script src="assets/js/SPE.js"></script>
    <script src="assets/js/VolumetricFire.js"></script>
    <script src="assets/js/utils/BufferGeometryUtils.js"></script>

    <!-- controls -->
    <script src="assets/js/controls/EditorControls.js"></script>
    <script src="assets/js/controls/TransformControls.js"></script>

    <!-- geometries -->
    <script src="assets/js/geometries/DecalGeometry.js"></script>
    <script src="assets/js/geometries/TeapotBufferGeometry.js"></script>

    <!-- loaders -->
    <script src="assets/js/loaders/TGALoader.js"></script>

    <!-- shaders -->
    <script src="assets/js/shaders/FXAAShader.js"></script>

    <!-- objects -->
    <script src="assets/js/objects/Sky.js"></script>
    <script src="assets/js/objects/Reflector.js"></script>
    <script src="assets/js/objects/Lensflare.js"></script>

    <!-- Shadow Editor -->
    <script src="build/ShadowEditor.js"></script>
    <script>
        let app = null;

        const getQueryString = name => {
            var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
        };

        const start = () => {
            app = new Shadow.Player(document.querySelector('#container'), {
                server: location.origin,
                enableThrowBall: false,
            });

            const sceneID = getQueryString('sceneID');
            const sceneFile = getQueryString('sceneFile');

            if (sceneID) { // 通过/api/Scene/Load?ID=sceneID获取场景数据
                fetch(`${app.options.server}/api/Scene/Load?ID=${sceneID}`).then(response => {
                    if (response.ok) {
                        response.json().then(json => {
                            if (json.Code === 200) {
                                app.start(JSON.stringify(json.Data));
                            }
                        });
                    }
                });
            } else if (sceneFile) { // 通过/Scene/sceneID.txt获取场景数据（导出用）
                fetch(`${app.options.server}/Scene/${sceneFile}.txt`).then(response => {
                    if (response.ok) {
                        response.json().then(json => {
                            app.start(JSON.stringify(json));
                        });
                    }
                });
            } else {
                alert('Lack sceneID or sceneFile query params, scene load failed.');
            }
        };

        window.onload = start;
    </script>
</body>

</html>